<template>
  <ProgressBar v-model="currentTime" :duration="totalDuration" :buffered="bufferProgress" @play="onPlay"
    @pause="onPause" @seek="onSeek" @speedChange="onSpeedChange"></ProgressBar>
  <div></div>
</template>

<script setup>
import * as  Cesium from 'cesium';
import { ref, onBeforeUnmount } from 'vue';
import ProgressBar from './ProgressBar.vue';
import UavModelLayer from './UavModelLayerClass';
import GridCell from './GridCell';

let uavLayerObj = null
let gridCellObj = null
let uavLayer = new Map()

// 数据
const currentTime = ref(0)      // 当前播放时间（秒）
const totalDuration = ref(300)  // 总时长（秒）
const bufferProgress = ref(0.3) // 缓冲进度（0-1）



async function initHistory (Viewer) {

  // 获取数据
  const uavData = await getUavData();
  console.log('uavData', uavData);

  // 初始化 UAV 模型图层
  uavLayerObj = new UavModelLayer(Viewer, uavLayer);

  // 初始化网格
  gridCellObj = new GridCell(Viewer, uavData[0][0])
  gridCellObj.loadGridDataJson(uavData[0], 'White')

  // 飞入到指定点位
  const firstPosition = uavData[0][0]
  Viewer.camera.flyTo({
    destination: Cesium.Cartesian3.fromDegrees(
      firstPosition[0],
      firstPosition[1],
      1000 // 默认高度100米
    ),
    duration: 2 // 飞行持续时间（秒）
  });

  // 使用 loadUavTrack 函数加载无人机轨迹
  uavData.forEach((trajectory, index) => {
    const uavInfo = {
      snCode: `UAV-${String(index + 1).padStart(3, '0')}`, // 生成唯一的无人机编号
      ownerType: index % 3, // 循环使用不同的无人机类型 (0, 1, 2)
      productCode: `25FH5603-XHJ-${index + 1}`, // 根据数据生成产品编号
      img: '/img/uav_2_1.svg' // 使用默认的无人机图标
    };

    // 调用 loadUavTrack 函数加载轨迹
    const timeInfo = uavLayerObj.loadUavTrack(uavInfo, trajectory);
    totalDuration.value = timeInfo.totalDuration; // 更新总时长
    console.log(timeInfo, "轨迹加载完成");
  });

}


// 播放控制相关变量（已移除定时器逻辑，使用 ProgressBar 内部计时器）

// 事件处理
const onPlay = () => {
  console.log('开始播放')
  if (!uavLayerObj) {
    console.warn('UAV图层对象未初始化')
    return
  }
  // 调用 startPlay 函数开始播放所有无人机轨迹
  uavLayerObj.startPlay()
}

const onPause = () => {
  console.log('暂停播放')
  if (!uavLayerObj) {
    console.warn('UAV图层对象未初始化')
    return
  }
  // 调用 plusEnd 函数暂停所有无人机轨迹播放
  uavLayerObj.plusEnd()
}

const onSeek = (time) => {
  console.log('跳转到:', time, '秒')
  // 当进度条拖拽或点击时，跳转所有无人机到指定时间点
  jumpAllUavsToTime(time)
  jumpALlGridToTime(time)
}

const onSpeedChange = (speed) => {
  console.log('播放速度改变为:', speed)
  // ProgressBar 组件会处理播放速度的更新
  // 这里可以添加其他需要响应速度变化的逻辑
}

/**
 * 跳转所有无人机到指定时间点
 * @param {number} time - 时间（秒）
 */
const jumpAllUavsToTime = (time) => {
  if (!uavLayerObj) return

  // 遍历所有无人机，跳转到指定时间点
  uavLayerObj.uavLayer.forEach((uavItem, snCode) => {
    if (uavItem.isTrackMode) {
      uavLayerObj.jumpToHistoryPoint(snCode, time)
    }
  })
}


/**
 * 网格变色
 * @param time 
 */
const jumpALlGridToTime = (time) => {
  if (!gridCellObj || !uavLayerObj) return

  uavLayerObj.uavLayer.forEach((uavItem, snCode) => {
    if (uavItem.isTrackMode) {
      const hisInfo = uavLayerObj.getHistoryInfo(snCode)
      if (hisInfo) {
        const targetTime = Cesium.JulianDate.addSeconds(hisInfo.startTime, time, new Cesium.JulianDate())
        const position = uavItem.uavIcon.position.getValue(targetTime)
        if (position) {
          const cartographic = Cesium.Cartographic.fromCartesian(position)
          gridCellObj.changeColor({
            position: [
              Cesium.Math.toDegrees(cartographic.longitude),
              Cesium.Math.toDegrees(cartographic.latitude),
              cartographic.height
            ],
            color: 'Green',
            oldColor: 'White',
            isGridColor: true,
            mode: 1
          })
        }
      }
    }
  })
}


async function getUavData () {
  // 获取 json1 目录下所有文件名
  const fileNames = ['25FH5603-XHJ.json'];
  // 批量请求所有 json 文件内容，增加错误处理
  const data = await Promise.all(
    fileNames.map(async name => {
      try {
        const res = await fetch(`/json1/${name}`);
        if (!res.ok) {
          console.warn(`请求失败: ${name}, 状态码: ${res.status}`);
          return null;
        }
        return await res.json();
      } catch (e) {
        console.warn(`解析失败: ${name}`, e);
        return null;
      }
    })
  );
  // 过滤掉为 null 的项
  return data.filter(item => item !== null);
}

defineExpose({
  initHistory
})

// 组件卸载时清理（已移除定时器逻辑）
onBeforeUnmount(() => {
  // 清理逻辑（如果需要的话）
  console.log('History 组件卸载')
})
</script>

<style scoped lang="scss"></style>